<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
</head>
<style type="text/css">
	header{
		position: relative;
		width: 100%;
		height: 50px;
		background-color: #669999;
	}
	header .left{
		font-size: 16px;
		position: absolute;
		top: 13px;
		bottom: 0;
		left: 8px;
		width: 100px;
		height: 50px;
	}
	header .left img{
		width: 24px;
	}
	header .center{
		font-size: 18px;
		position: absolute;
		top: 16px;
		left: 0;
		right: 0;
		color: #fff;
		letter-spacing: 8px;
	}
	#pBody{
		width: 100%;
	}
	#pHeader{
		position: relative;
		width: 100%;
		background: url("../image/bc.jpg");
		height: 80px;
		opacity: 0.8;
	}
	#head{
		position: absolute;
		width: 80px;
		top: 40px;
	}
	#head img{
		width: 100%;
		border-radius: 50px;
	}
	#information{
		width: 100%;
		margin-top: 80px;
	}
	#information .info{
		width: 80%;
		height: 40px;
		margin-left: 30px;
		border-bottom: 1px solid rgba(102,153,153,0.4);
	}
	#information .info span{
		line-height: 40px;
		color: #4C4C4C;
	}
</style>
<body>
	<header>
   		<div class="left" id="leftBtn">
			<img src="../image/back.png">
   		</div>
   		<div class="center">个人中心</div>
   		<div class="right"></div>
   	</header>
   	<div id="pBody">
   		<div id="pHeader">
			<div id="head">
				<img src="../image/head.jpg">
			</div>
   		</div>
   		<div id="information">
   			<div class="info">
   				<span>姓名：李强</span>
   			</div>
   			<div class="info">
   				<span>学号：201558234080</span>
   			</div>
   			<div class="info">
   				<span>学院：软件工程学院</span>
   			</div>
   			<div class="info">
   				<span>专业：软件工程</span>
   			</div>
   			<div class="info">
   				<span>班级：2015级2班</span>
   			</div>
   			<div class="info">
   				<span>邮箱：hsylqlucas@outlook.com</span>
   			</div>
   			<div class="info">
   				<span>联系电话：11011011011</span>
   			</div>
   		</div>
   	</div>
</body>

<script type="text/javascript" src="../script/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript">
    apiready = function(){
    	var w = $(window).width();
  		var h = $(window).height();
  		$(".center").css("left",(w-72)/2 + "px");
  		$("#head").css("left",(w-80)/2 + "px");
   	};

   	$("#leftBtn").click(function(){
   		api.openWin({
         	name: 'main',
            url: '../html/main.html',
            bounces: true,
  		});
   	});
</script>
</html>